<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>SNS345345345首页</title>
	<!-- 新 Bootstrap 核心 CSS 文件 -->
	<link rel="stylesheet" href="./Tp/css/bootstrap.min.css">

	<!-- 可选的Bootstrap主题文件（一般不用引入） -->
	<link rel="stylesheet" href="./Tp/css/bootstrap-theme.min.css">

	

</head>
 <body>

    <nav class="navbar navbar-inverse navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">留言板</a>
        </div>
        <div id="navbar" class="navbar-collapse collapse">

          <?php if(isset($_SESSION['username'])){ ?>
                <div class="navbar-form navbar-right">
                  <a class="btn btn-success">
                  <?php echo $_SESSION['username'] ?></a>
                  
                  <a href="./loginout.php" class="btn btn-danger">退出</a>
                </div>
                
          <?php }else{ ?>

              <form class="navbar-form navbar-right" action="./login.php" method="post">
              <div class="form-group">
                <input type="text" placeholder="用户名" class="form-control" name="username">
              </div>
              <div class="form-group">
                <input type="password" placeholder="密码" class="form-control" name="passwd">
              </div>
              <button type="submit" class="btn btn-success">登录</button>
              <a  href="./register.php" class="btn btn-success">注册</a>
            </form>

          <?php } ?>
        </div><!--/.navbar-collapse -->
      </div>
    </nav>

    <!-- Main jumbotron for a primary marketing message or call to action -->
    <div class="jumbotron">
      
    </div>
    <style type="text/css">
      .glyphicon-ok{
        color: #469D46;
      }

      .glyphicon-remove{
        color: #ED1C24;
      }

    </style>

    <div class="container">
      <!-- Example row of columns -->
      <div class="row">
        <div class="col-sm-8">
			    <form class="form-horizontal" action='./adduser.php' method="post">
          <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label">用户名</label>
            <div class="col-sm-6">
              <input type="text" class="form-control" id="inputEmail3" name="username" placeholder="用户名">
            </div>
            <div class="show col-sm-4">
            </div>
          </div>
          <div class="form-group">
            <label for="inputPassword3" class="col-sm-2 control-label">密码</label>
            <div class="col-sm-6">
              <input type="password" class="form-control" name="passwd" id="inputPassword3" placeholder="密码">
            </div>
            <div class="show col-sm-4">
                <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>用户名已经存在
            </div>
          </div>
          <div class="form-group">
            <label for="inputPassword3" class="col-sm-2 control-label">确认密码</label>
            <div class="col-sm-6">
              <input type="password" class="form-control" name="confirmpasswd" id="inputPassword3" placeholder="确认密码">
            </div>
          </div>
          <div class="form-group">
            <div class="col-sm-offset-2 col-sm-6">
              <button type="submit" class="btn btn-default" disabled="" id="button">注册</button>
            </div>
          </div>
        </form>
			 
		    </div>
        
      </div>

      <hr>

      <footer>
        <p>&copy; Company 2014</p>
      </footer>
    </div> <!-- /container -->

    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
	<script src="./Tp/js/jquery.min.js"></script>

	<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
	<script src="./Tp/js/bootstrap.min.js"></script>

  <script type="text/javascript">
  $(function  () {

    $('#inputEmail3').blur(function(event) {
        data = $(this).val();
        $.ajax({
          url: './Ajax.php',
          type: 'post',
          dataType: 'json',
          data: {username: data},
          success:function (data) {
            if(data.error==0){
                $('#inputEmail3').parent().siblings('.show').html("<span class=\"glyphicon glyphicon-ok\" aria-hidden=\"true\"></span>"+data.info);
                $('#button').removeAttr('disabled');
            }else{
                $('#inputEmail3').parent().siblings('.show').html("<span class=\"glyphicon glyphicon-remove\" aria-hidden=\"true\"></span>"+data.info);
            }
              
          },
          error:function (data){
              alert(444444);
          }
        });
    });

  })
  </script>
  </body>
</html>